<template>
  <div>
    <el-row>
      <el-col :span="12">
        <title-line title="收货人信息" />
        <div class="ft-14">
          <p class="mt-10">收货人：{{ address && address.name }}</p>
          <p class="mt-10">联系电话：{{ address && address.mobile }}</p>
          <p class="mt-10">收货地址：{{ addressDetail || '暂无' }}</p>
        </div>
      </el-col>
      <el-col v-if="details && details.orderStatus === -1" :span="12">
        <title-line title="操作人信息" />
        <div class="ft-14">
          <p class="mt-10">操作人：{{ details.cancelOperator }}</p>
          <p class="mt-10">操作时间：{{ details.cancelTime }}</p>
          <p class="mt-10">备注：{{ details.cancelReason ? details.cancelReason : '暂无' }}</p>
        </div>
      </el-col>
    </el-row>
  </div>
</template>

<script>
export default {
  name: 'OrderItemInfo',
  props: {
    details: {
      type: Object,
      default: () => {
        return {}
      }
    }
  },
  data() {
    return {
      visible: false
    }
  },
  computed: {
    address() {
      return this.details?.address
    },
    addressDetail() {
      const { provinceName, cityName, districtName, detail } = this.details?.address ?? {}
      return `${provinceName}${cityName}${districtName}${detail}`
    }
  }
}
</script>
